
import { Style, Icon, Text, Fill, Circle, Stroke } from 'ol/style'
// import CircleStyle from 'ol/style/Circle'

import uav_icon from '@/assets/map/uav.png'
import airport from '@/assets/map/airport.png'

export const layerStyle = (type, option) => {
  if (type === 'geoMarker') {
    return new Style({
      image: new Icon({
        anchor: [0.5, 0.5],
        src: uav_icon,
        crossOrigin: 'anonymous',
        // scale: [1, 1],
        scale: 0.5,
        rotateWithView: true
      })
    })
  } else if (type === 'route') {
    return new Style({
      stroke: new Stroke({
        width: 4,
        color: '#FFB81B'
      })
    })
  } else if (type === 'airport') {
    return new Style({
      image: new Icon({
        anchor: [0.5, 0.5],
        src: airport,
        crossOrigin: 'anonymous',
        // scale: [1, 1],
        scale: 1,
        rotateWithView: true
      }),
      text: new Text({
        // 文字内容
        // text: feature ? `${feature.get('props').name}` : '',
        text: option?.name ? `${option.name}` : '',
        // 位置
        textAlign: 'center',
        // 基准线
        textBaseline: 'top',
        offsetY: -80,
        // 文字样式
        font: '20px SourceHanSansCN-Regular ',
        backgroundFill: new Fill({
          color: 'rgba(33, 66, 141, 0.5)'
        }),
        padding: [6, 10, 6, 10],
        // 文字颜色
        fill: new Fill({
          color: '#FFFFFF'
        })
      })
    })
  } else if (type === 'airLine') {
    return new Style({
      stroke: new Stroke({
        width: 4,
        color: '#0081FF'
      })
    })
  }
}
